<template>
    <el-footer height="25px">
        <div class="data-info">
            <span>当前壁纸来源：<a href="javascript:;" @click.stop.prevent="openPlatform">{{platformsInfo.name}}</a></span>&nbsp;&nbsp;|&nbsp;&nbsp;
            <span><a href="javascript:;" @click.stop.prevent="$emit('update:isShowAbout', true)">关于</a></span>
        </div>
    </el-footer>
</template>

<script>
    const shell = require('electron').shell;
    export default {
        name: "bottom-bar",
        data () {
            return {
                'platformsInfo' : {}
            }
        },
        methods: {
            openPlatform() {
                shell.openExternal(this.platformsInfo.link)
            },
            changePlatform() {
                let currentPlatform = this.dataSourceFactory.getCurrentPlatform();
                let platformMap = this.dataSourceFactory.getPlatforms();
                this.platformsInfo = platformMap[currentPlatform];
            }
        },
        mounted() {
            this.changePlatform()
        }
    }
</script>

<style scoped>
    .el-footer {
        background-color: #eee;
        color: #333;
        line-height: 27px;
        position: fixed;
        bottom: 0;
        width: 100%;
    }
    .data-info {
        text-align: right;
        font-size: 12px;
    }
</style>
